<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/inc/taglib.inc" %>
<%@ include file="/WEB-INF/inc/script.inc" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
	<base href="${base}">
    <title>中金通 | 佣金设置</title>

    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link href="font-awesome/css/font-awesome.css" rel="stylesheet">

	<!-- Data Tables -->
    <link href="css/plugins/dataTables/dataTables.bootstrap.css" rel="stylesheet">
    <link href="css/plugins/dataTables/dataTables.responsive.css" rel="stylesheet">
    <link href="css/plugins/dataTables/dataTables.tableTools.min.css" rel="stylesheet">

    <link href="css/animate.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">

    <link href="css/plugins/datapicker/datepicker3.css" rel="stylesheet">

</head>

<body>

    <div id="wrapper">

    	<!-- 左侧菜单 -->
        <jsp:include page="/WEB-INF/jsp/common/main-menu.jsp"></jsp:include>

        <div id="page-wrapper" class="gray-bg">
        <div class="row border-bottom">
        <!-- 头部工具栏区 -->
        <jsp:include page="/WEB-INF/jsp/common/main-header.jsp"></jsp:include>
        </div>
            <div class="row wrapper border-bottom white-bg page-heading">
                <div class="col-lg-10">
                    <h2>产品管理</h2>
                    <ol class="breadcrumb">
                        <li>
                            <a href="common/platform">Home</a>
                        </li>
                        <li>
                            <a href="product/list">产品管理</a>
                        </li>
                        <li>
                         <a href="product/list">产品列表</a>
                        </li>
                        <li>
                            <a>${product.briefName}</a>
                        </li>
                        <li class="active">
                            <strong>佣金设置</strong>
                        </li>
                    </ol>
                </div>
                <div class="col-lg-2">

                </div>
            </div>
		
		<div class="row" style="margin-top:10px;">
			<div class="col-md-12">
                    <div class="tabs-container">
                        <ul class="nav nav-tabs">
                            <li>
								<a href="product/list">
									 产品列表
								</a>
							</li>
							<li>
								<a href="product/add">
								 	新增产品
								</a>
							</li>
							<li class="active">
								<a>
									 佣金设置
								</a>
							</li>
                        </ul>
                        <div class="tab-content">
                            <div class="tab-pane active">
                                <div class="panel-body">
                                <div class="wrapper wrapper-content animated fadeInRight ecommerce">
						                        <div ><!-- class="ibox-content" -->
						                            <form method="post" id="addForm" enctype="multipart/form-data" action="product/doAdd" class="form-horizontal">
						                              <input type="text" id="productId" name="id" style="display:none" value="${product.id}">
						                              
						                              <!--Detail form start-->
						                              <div class="row" style="padding-left:17px">
									                    <div class="col-sm-4" >
									                        <div class="form-group" >
									                            <label class="col-sm-2 control-label">产品简称</label>
						                                        <div class="col-sm-8">
						                                    	   <input readonly style="border:0px;background:#0f0;background-color:transparent;" type="text" name="briefName" class="form-control"  value="${product.briefName}">
						                                        </div>
									                        </div>
									                    </div>
									                 </div>
						                            <!--  <div class="hr-line-dashed"></div> -->
						                              <div class="row" style="padding-left:17px">
									                    <div class="col-sm-4">
									                        <div class="form-group">
									                            <label class="col-sm-2 control-label">产品代码</label>
						                                        <div class="col-sm-8">
						                                    	   <input readonly style="border:0px;background:#0f0;background-color:transparent;" type="text" name="productCode" class="form-control"  value="${product.productCode}">
						                                        </div>
									                        </div>
									                    </div>
									                 </div>
						                             <!-- <div class="hr-line-dashed"></div> -->
						                             <div class="row" style="padding-left:17px">
									                    <div class="col-sm-4">
									                        <div class="form-group">
									                            <label class="col-sm-2 control-label">佣金设置</label>
						                                        <div class="col-sm-8">
						                                    	     <input type="radio"  value="option1" id="optionsRadios1" name="optionsRadios">&nbsp;默认设置&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                                                     <input type="radio"  value="option2" id="optionsRadios2" name="optionsRadios">&nbsp;自定义设置
						                                        </div>
									                        </div>
									                    </div>
									                 </div>
									                 </form>
									                 <br>
						                             <!-- <div class="hr-line-dashed"></div> -->
						                              <div class="row" id="customSet">
										                <div class="col-lg-12">
										                    <div class="ibox float-e-margins">
										                        <div class="ibox-content">
										                            <table id="modelEditable_comm" class="table table-striped table-bordered table-hover">
										                                <thead>
											                               	 <tr>
											                                    <th>团队名称</th>
											                                    <th>团队组长</th>
											                                    <th>团队成员</th>
											                                    <th>佣金</th>
											                                </tr>
										                              	  </thead>
											                              <tbody>
											                              </tbody>
											                        </table>
										                        </div>
										                    </div>
										                </div>
										            </div>
										            
										            <!-- update model start -->
													<div class="modal inmodal fade" id="updateModel_comm" tabindex="-1" role="dialog"  aria-hidden="true">
						                                <div class="modal-dialog modal-lg">
						                                    <div class="modal-content">
						                                        <div class="modal-header">
						                                            <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
						                                            <h4 class="modal-title" id="d_title">待填写</h4>
						                                        </div>
						                                        <div class="modal-body">
						                                        <div id="updateBody_comm"></div>
						                                        <div class="form-horizontal">
						                                			<div class="form-group"><label class="col-sm-2 control-label" id="d_old_val">待填写</label>
						                                    			<div class="col-sm-8"><input readonly style="border:0px;background:#0f0;background-color:transparent;" type="text" id="old_val" class="form-control" >
						                                				</div>
						                                			</div>
						                                			<div class="form-group"><label class="col-sm-2 control-label" id="d_new_val">待填写</label>
						                                    			<div class="col-sm-8"><input type="text" id="new_val" class="form-control" >
						                                            	</div>
						                                			</div>
						                                			<span id="renameInfo" class="col-sm-2 control-label"></span>
						                                       </div>
																	
						                                        </div>
						                                        <div class="modal-footer">
						                                            <button type="button" class="btn btn-white" data-dismiss="modal">取 消</button>
						                                            <button type="button" id="saveModel" class="btn btn-primary" onclick="setRate()">保 存</button>
						                                        </div>
						                                    </div>
						                                </div>
						                            </div>
						                            <!-- update model end --> 
						                 </div> 
						            </div>
                                </div>
                            </div>
                            
                            
                        </div>
                    </div>
                </div>
		</div>
		
        <!-- 底部版权 -->
        <jsp:include page="/WEB-INF/jsp/common/main-footer.jsp"></jsp:include>

        </div>
        </div>

    <!-- Mainly scripts -->
    <script src="js/jquery-2.1.1.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/plugins/metisMenu/jquery.metisMenu.js"></script>
    <script src="js/plugins/slimscroll/jquery.slimscroll.min.js"></script>
	<script src="js/jquery.serialize-object.min.js" type="text/javascript"></script>
	<script src="js/plugins/validate/jquery.validate.min.js" type="text/javascript"></script>
    <!-- Custom and plugin javascript -->
    <script src="js/inspinia.js"></script>
    <script src="js/plugins/pace/pace.min.js"></script>
	<script src="js/plugins/bootbox/bootbox.min.js" type="text/javascript"></script>
    <!-- Data picker -->
    <script src="js/plugins/datapicker/bootstrap-datepicker.js"></script>

    <!-- Data Tables -->
    <script src="js/plugins/dataTables/jquery.dataTables.min.js"></script>
    <script src="js/plugins/dataTables/dataTables.bootstrap.js"></script>
    <script src="js/plugins/dataTables/dataTables.responsive.js"></script>
    <script src="js/plugins/dataTables/dataTables.tableTools.min.js"></script>
    
    <!-- 业务 -->
    <script src="js/ajaxfileupload.js"></script>
    <script src="js/jquery.form.js"></script>
    <script src="js/product/product-commission.js"></script> 
    <script src="js/product/FormatUtils.js"></script>
   

    <!-- Page-Level Scripts -->
    <script>
        $(document).ready(function() {
        	CommissionSetModule.init();
			
			initSpecifiedContent();
			
        });
       
        function initSpecifiedContent(){
        	if("${product.defaultCommissionSet}"=="true"){
        		$("input[type='radio'][value='option1']").attr("checked","checked" );
        		$("#customSet").hide();
        	}else{
        		$("input[type='radio'][value='option2']").attr("checked","checked" );
        		$("#customSet").show();
        	}
        	
        	 $("input[name='optionsRadios']").bind("click",function(){ 
                 
        	        //测试操作代码 
        	        if($(this).val()=="option1"){
        	        	$("#customSet").hide();
        	        	updateCommissionSetButton(true);
        	        }else{
        	        	$("#customSet").show();
        	        	updateCommissionSetButton(false);
        	        }
        	 });
        }
        
        function updateCommissionSetButton(flag){
        	$.ajax({
            	type:"get",
                url: ctx + "/product/update",
                data:"id="+$("#productId").val()+"&defaultCommissionSet="+flag,
                dataType:"json",
                success: function(data){
                	
                },
                error: function (msg) {
                	bootbox.alert(msg.message);
                }
            });
        }
        
        var employeeId;
        function setRate(){
        	var old_val = $("#old_val").val();
        	var new_val = $("#new_val").val();
        	if(null == new_val || "" == new_val.trim() || old_val==new_val){
        		bootbox.alert("请输入与原费率不同的且不为空的值！");
        		return;
        	}
        	
        	if(new_val<0||new_val>100){
        		bootbox.alert("请输入0-100费率值！");
        		return;
        	}
        	
            var productId = $("#productId").val();
            var param = $("#d_title").text().indexOf("提成")!=-1?"&dividendRate="+new_val:"&commissionRate="+new_val;
            
        	$.ajax({
            	type:"post",
                url: ctx + "/product/setRate",
                data:"productId=" + productId +"&employeeId="+employeeId+param,
                dataType:"json",
                success: function(data){
                	if (data.code == 1) {
                		modal.modal('hide');
                		bootbox.alert("设置成功！");
                		oTable.fnClearTable();
                	}
                },
                error: function (msg) {
                	bootbox.alert(msg.message);
                }
            });
        }
    </script>

</body>
</html>